<template>
	<div class="ipPatent">
		<!-- 知识产权-专利导航栏 -->
		<div class="ipPatent_nav">
			<div class="ipPatent_nav_item" :class="ipPatentNum==0 ? 'active':''" @click="toNum(0)">全部专利({{allPatent}})</div>	
			<div class="ipPatent_nav_item" :class="ipPatentNum=='发明专利' ? 'active':''" @click="toNum('发明专利')">发明专利({{inventzl}})</div>
			<div class="ipPatent_nav_item" :class="ipPatentNum=='发明授权' ? 'active':''" @click="toNum('发明授权')">发明授权({{inventsq}})</div>
			<div class="ipPatent_nav_item" :class="ipPatentNum=='实用新型' ? 'active':''" @click="toNum('实用新型')">实用新型({{practical}})</div>
		</div>
		<div class="ipPatent_form">
			<!-- 表格对应的4个圆点 -->
			<div class="lineRadius l1"></div>
			<div class="lineRadius l2"></div>
			<div class="lineRadius r1"></div>
			<div class="lineRadius r2"></div>
			<!-- 表格 -->
			<table class="ntable">
			    	<tr>
			    		<th width="45%" class="tx">专利名称</th> 
			    		<th  colspan="2">专利类型</th>
			     		<th colspan="">申请日 </th>
			     		<th colspan="" width="20%">公开号</th>
			     		<th colspan="">公开日 </th>
			     	</tr> 
			     	<tr v-for="(item,index) in baseData" :key="index">
			     		<td rowspan="1" v-html="item.title"></td> 
			     		<td colspan="2" class="left">{{item.patent_type}}</td>
			     		<td colspan="" class="">{{item.application_date}}</td>
			     		<td colspan="" class="">{{item.publication_code}}</td>
			     		<td colspan="" class="">{{item.publication_date}}</td>
			     	</tr>
			     </table>
		</div>
	</div>
</template>

<script>
	export default{
		name:'ipPatent',
		data() {
			return{
				ipPatentNum:0, //导航栏当前数
				sbcompany:'',  //当前公司名
				baseData:[], //基本信息
				allPatent:0,//全部专利数
				inventzl:0,//发明专利数
				inventsq:0,//发明专授权数
				practical:0,//实用新型数
				fieldList:[{
								"key":"company_name",
								"value":''
							}] //请求参数变量
			}
		},
		mounted() {
			this.getBasedata()
			this.getZhuanlidata()
		},
		methods:{
			// 获取对应的专利数
			async getZhuanlidata(){
				this.sbcompany=this.$route.query.comname
				var dt = {
					"params": {
						"normGuid": "4cea4a8e-51fb-44dd-8cf5-06149c814428",
							"fieldList":[{"key":"company_name","value":this.sbcompany}]
						}
				};
				const aaa = await this.$api.post('dcockpit/rest/cockpitApi/searchListNormResult', dt)
				let {custom:{result}}={...aaa}
				let zldata=result.cockpitData
				zldata=zldata.map(item=>{
					if(item.patent_type=='发明专利'){
						this.inventzl=item.total
					}else if(item.patent_type=='发明授权'){
						this.inventsq=item.total
					}else{
						this.practical=item.total
					}
					return item
				})
			},
			// 获取全部专利数据
			async getBasedata(){
				this.sbcompany=this.$route.query.comname
				// this.sbcompany='宝山钢铁股份有限公司'
				this.fieldList[0].value = this.sbcompany
				var dt = {
					"params": {
						"normGuid": "d69168c5-b105-4d3b-a915-18614b2c1c82",
							"fieldList": this.fieldList
						}
				};
				const aaa = await this.$api.post('dcockpit/rest/cockpitApi/searchListNormResult', dt)
				let {custom:{result}}={...aaa}
				this.baseData=result.cockpitData
				if(this.fieldList.length==1){
					this.allPatent=this.baseData.length
				}
			},
			// 切换导航栏,获取对应的专利数据
			toNum(e){
				// console.log(e)
				this.ipPatentNum=e
				if(e==0){
					this.fieldList=[{"key":"company_name","value":""}]
					this.$nextTick(()=>{
						this.getBasedata()
					})
				}else{
					this.fieldList=[{"key":"company_name","value":""},{"key":"patent_type","value":e}]
					this.$nextTick(()=>{
						this.getBasedata()
					})
				}
			}
		},
	}
</script>

<style lang="stylus" rel='stylesheet/stylus' scoped>
	@import "~@/assets/ipPatent.styl"
</style>
